/**
 * @project         Jx
 * @revision        $Id: tree.css 755 2010-03-15 03:09:37Z jonlb@comcast.net $
 * @author          Fred Warnock (fwarnock@dmsolutions.ca)
 * @copyright       (c) 2006 DM Solutions Group Inc.
 */

/* =========== */
/* TREE STYLES */
/* =========== */

/* The jx tree built out of nested ULs
   For this to work visually, the margins and padding need to be flattened
   out, and the list marker needs to be hidden
*/


.jxTree,
.jxTreeRoot {
  /* relative positioning is required for IE to fix the peek-a-boo bug */
  position:relative;
  display: block;
  list-style: none;
  margin: 0px;
  padding: 0px;
}

.jxTreeNest {
  list-style: none;
  margin: 0px;
  padding: 0px;
  background-repeat: repeat-y;
  background-position: left top;
}

/* Node Classes */

li.jxTreeContainer {
  /* relative positioning is required for IE to fix the peek-a-boo bug */
  position:relative;
  display: block;
  margin: 0px;
  padding: 0px;
  background-repeat: no-repeat;
  /* background branches may need to shift up/down according to height of the node */
  background-position: left top;
  white-space: nowrap;
  font-size: 0px;
  line-height: 0px;
  user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
}

.jxTree li.jxTreeContainer {
  margin-left: 16px;
}

a.jxTreeItem {
  position: relative;
  display: block;
  cursor: pointer;
  outline: none;
  overflow: hidden;

  background-image: url(images/tree_hover.png);
  background-repeat: repeat-x;
  background-position: left top;
  border: none;

  margin: 0px 1px 0px 17px;
  padding: 0px 0px 0px 20px;
  z-index: 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #000;
  text-decoration: none;
  /* Line Height needs to be an even number so branches line up properly */
  line-height: 20px;
  height: 20px;
}


a.jxTreeItem:focus {
  border-left: 1px dotted #75ADFF;
  border-right: 1px dotted #75ADFF;
  margin: 0px 0px 0px 16px;
  background-position: left -72px;
}

a.jxTreeItem:hover,
li.jxTreeContainer a.jxHover {
  /*border: 1px solid #C5E0FF;*/
  border-left: 1px solid #CDDFFD;
  border-right: 1px solid #CDDFFD;
  margin: 0px 0px 0px 16px;
  background-color: #CDE5FF;
  background-position: left -24px;
}

li.jxTreeContainer a.jxSelected,
li.jxTreeContainer a.jxSelected:hover,
li.jxTreeContainer a.jxPressed,
li.jxTreeContainer a.jxPressed:hover {
  border-left: 1px solid #8AABFB;
  border-right: 1px solid #8AABFB;
  margin: 0px 0px 0px 16px;
  background-color: #CDE5FF;
  background-position: left -48px;
}

li.jxDisabled a.jxTreeItem {
  cursor: default;
}
            
li.jxDisabled a.jxTreeItem:focus,
li.jxDisabled a.jxTreeItem:hover {
  background-position: left top;
  background-color: transparent;
  border: none;
  margin: 0px 1px 0px 17px;
}

.jxTreeNest {
  background-image: url(images/tree_vert_line.png);
}

img.jxTreeImage,
img.jxTreeIcon {
  position: absolute;
  display: inline;

  left: 0px;
  top: 0px;
  width: 16px;
  height: 20px;

  z-index: 1;

  background-image: url(images/tree.png);
  background-repeat: no-repeat;

  border: 0px;
  margin: 0px;
}

img.jxTreeIcon { 
  height: 16px;
  top: 2px;
  left: 1px;
}

.jxTreeBranchOpen .jxTreeIcon,
.jxTreeBranchLastOpen .jxTreeIcon {
  background-position: left -40px; /* open folder image */
}


.jxTreeBranchOpen .jxTreeImage {
  background-position: left -100px; /* minus image */
}

.jxTreeBranchLastOpen .jxTreeImage {
  background-position: left -160px; /* minus last image */
}

.jxTreeBranchClosed .jxTreeIcon,
.jxTreeBranchLastClosed .jxTreeIcon {
  background-position: left -20px; /* closed folder image */
}


.jxTreeBranchClosed .jxTreeImage {
  background-position: left -80px; /* plus image */
}

.jxTreeBranchLastClosed .jxTreeImage {
  background-position: left -140px; /* plus last image */
}

.jxTreeLeaf .jxTreeIcon,
.jxTreeLeafLast .jxTreeIcon {
  background-position: left 0px; /* page image */
}

.jxTreeLeaf .jxTreeImage {
  background-position: left -60px; /* node image */
}

.jxTreeLeafLast .jxTreeImage {
  background-position: left -120px; /* last node image */
}


a.jxTreeItem,
img.jxTreeImage,
img.jxTreeIcon,
span.jxTreeLabel,
.jxTreeItemContainer input {
    vertical-align: middle;
}

img.jxTreeImage.jxBusy {
    background-image: url(images/spinner_16.gif);
    background-position: left top;
}